<template>
  <n-el tag="div" class="box-container">
    <four-angel>
      <n-el tag="div" class="boxTitle">{{ boxTitle }}</n-el>
      <n-el tag="div" class="main-content">
        <slot></slot>
      </n-el>
    </four-angel>
  </n-el>
</template>

<script setup lang="ts" name="HzBox7">
import {defineProps} from "vue";
import FourAngel from "/@com/hz-box/FourAngel.vue";

const props = defineProps({
  boxTitle: {
    type: String,
    default: "",
  },
});

</script>

<style lang="scss" scoped>
.box-container {
  width: 100%;
  height: 100%;
  .boxTitle {
    height: 28px;
    line-height: 28px;
    text-align: center;
    width: 100%;
    font-size: 0.9rem;
    color: #b3efff;
    font-family: "黑体";
  }
  .main-content {
    height: calc(100% - 28px);
    width: 100%;
  }
}
</style>
